In [1]:
import numpy  as np
import pandas as pd

from ChordDiagram import ChordDiagram

from bokeh.layouts import row
from bokeh.io import push_notebook, show, output_notebook
output_notebook()


Loading BokehJS ...

Chord Diagrams for Bokeh

Chord diagrams are a wonderful way to visualise interactions between groups, along the genome, and many others (check the circos page for some advances examples). I recently had the need to implement a basic chord diagram into a Bokeh app. Based on Plotly's post about Chord Diagrams, I implemented a basic class which can be used with Bokeh. I hope that it can serve as starting point and can be used in other implementations as well.

The existing chord diagram implementation (as of Bokeh version 0.12.4) has a rather odd look (which is espacially apparent if you zoom in a bit).

Input data

As outlined in Plotly's post, the input data must be a square matrix, where each row denotes one group member (or entity, or item, or, ...). Each column holds the interaction between two group members. It is assumed that the row group member is "sending" interaction to the column group member. The total interaction is thus given by the sum of the $\{i,j\}$ and $\{j,i\}$ values.

Taking the example of the used in the post we have,


In [2]:
# Each row defines how many items were "send" to the group specified by the column
# for the "golden image" use case, the matrix should be symmetric
matrix = np.array([[16,  3, 28,  0, 18],
                   [18,  0, 12,  5, 29],
                   [ 9, 11, 17, 27,  0],
                   [19,  0, 31, 11, 12],
                   [23, 17, 10,  0, 34]], dtype=int)

labels = ['One', 'Two', 'Three', 'Four', 'Five']
pd.DataFrame(matrix, columns=labels, index=labels)


Out[2]:
One Two Three Four Five
One 16 3 28 0 18
Two 18 0 12 5 29
Three 9 11 17 27 0
Four 19 0 31 11 12
Five 23 17 10 0 34

which indicates that group Three was sending 11 items to group Two while receiving 12 items in return. Group Three has furthermore 17 interactions with itself, whereas group Two has none.

Building the Chord Diagram

The chord diagram can be build by handing the input data to the ChordDiagram class.


In [3]:
cd = ChordDiagram(matrix)

The interactions between the groups can now be visualised by calling the plot method of the ChordDiagram class. The index of the group corresponds to the row of the input data.


In [4]:
fig = cd.plot(group=0)
t = show(row(fig, ), notebook_handle=True)



In [ ]: